<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./assets/css/bootstrap.min.css">
    <script src="./assets/js/jquery.js"></script>
    <script src="./assets/js/template-web.js"></script>
    <style>
        .title {
            float: left;
        }
        .add {
            float: right;
            margin-top: 30px;
        }
    </style>
</head>
<body>
    <div class="container">
        <table class="table table-striped">
            <caption>
                <h2 class="title">学生信息</h2>
                <span class="add"><a href="./add.html">添加新学生</a></span>
            </caption>
            <thead>
                <tr>
                    <th>id</th>
                    <th>姓名</th>
                    <th>昵称</th>
                    <th>性别</th>
                    <th>年龄</th>
                    <th>入学时间</th>
                    <th>系别</th>
                    <th>操作</th>
                </tr>
            </thead>
    
            <tbody>
                
            </tbody>
        </table>
    </div>
    <script type="text/tpl" id="sList">
        {{each data value}}
        <tr>
            <td>{{value.sno}}</td>
            <td>{{value.sname}}</td>
            <td>{{value.snickname}}</td>
            <td>{{value.sgender}}</td>
            <td>{{value.sage}}</td>
            <td>{{value.stime}}</td>
            <td>{{value.dname}}</td>
            <td>
                <button class="btn btn-warning" onclick="edit({{value.sno}})">编辑</button>
                <button class="btn btn-danger" onclick="del({{value.sno}})">删除</button>
            </td>
        </tr>
        {{/each}}
    </script>

    <script>
        var url = "/school/api/v1.0/student"

        $.ajax({
            url: url,
            method: "get",
            success (response) {
                console.log(response)
                var tbodyStr = template("sList", {data: response.data})
                $('tbody').html(tbodyStr)
            }
        })

        function del (id) {
            $.ajax({
                url: url + "/" + id,
                method: "delete",
                success (response) {
                    console.log(response)
                    if (response.code === 200) {
                        alert("删除成功");
                        location.reload();
                    } else {
                        alert("删除失败");
                    }
                    
                }
            })
        }

        function edit (sno) {
            location.href = "./edit.html?son=" + sno
        }

    </script>
</body>
</html>